<div ng-controller='MenuIndex' class='right-cont wrap-menu-list'>
    <div class='title'>
        <div class="title-line" ></div>
        <div class="title-word" >菜单管理</div>
    </div>

    <div class='box-cont'>
        <div>
            <button class='btn btn-primary btn-sm btn-w-sm btn-shadow' ng-click='edit(0)'>
                添加
            </button>
        </div>

        <hr class='hr-sm'>

        <ul class='list-group list-recursive'>
            <div ng-repeat='menu in menus'>
                <li class='list-group-item clearfix'>
                    <span class='span'>
                        <i class='fa fa-angle-down fa-sys' data-toggle='collapse' 
                            href='#co_{{menu.id}}' ng-if='menu.child.length'>
                        </i>
                        <i class='fa fa-cirlce-o' data-toggle='collapse' 
                            href='#co_{{menu.id}}' ng-if='!menu.child.length'>
                        </i>
                        {{menu.title}}
                    </span>
                    <span class='span url'>{{menu.url}}</span>
                    <span class='span'>{{menu.hide_title}}</span>
                    <span class='pull-right span'>
                        <button class='btn btn-success btn-xs btn-w-xs' ng-click='edit(menu.id)'>编辑</button>
                        <button class='btn btn-danger btn-xs btn-w-xs' ng-click='del(menu.id)'>删除</button>
                    </span>
                </li>
                
                <ul class='list-group list-recursive systole collapse' id='co_{{menu.id}}'>
                    <div ng-repeat='menu_a in menu.child'>
                        <li class='list-group-item clearfix'>
                            <span class='span'>
                                <i class='fa fa-angle-down fa-sys' data-toggle='collapse' 
                                    href='#co_{{menu_a.id}}' ng-if='menu_a.child.length'>
                                </i>
                                <i class='fa fa-circle-o' data-toggle='collapse' 
                                    href='#co_{{menu_a.id}}' ng-if='!menu_a.child.length'>
                                </i>
                                {{menu_a.title}}
                            </span>
                            <span class='span url'>{{menu_a.url}}</span>
                            <span class='span'>{{menu_a.hide_title}}</span>
                            <span class='pull-right span'>
                                <button class='btn btn-success btn-xs btn-w-xs' ng-click='edit(menu_a.id)'>编辑</button>
                                <button class='btn btn-danger btn-xs btn-w-xs' ng-click='del(menu_a.id)'>删除</button>
                            </span>
                        </li>

                        <ul class='list-group list-recursive systole collapse' id='co_{{menu_a.id}}'>
                            <div ng-repeat='menu_b in menu_a.child'>
                                <li class='list-group-item clearfix'>
                                    <span class='span'>
                                        <i class='fa fa-circle-o'></i>
                                        {{menu_b.title}}
                                    </span>
                                    <span class='span url'>{{menu_b.url}}</span>
                                    <span class='span'>{{menu_b.hide_title}}</span>
                                    <span class='pull-right span'>
                                        <button class='btn btn-success btn-xs btn-w-xs' ng-click='edit(menu_b.id)'>编辑</button>
                                        <button class='btn btn-danger btn-xs btn-w-xs' ng-click='del(menu_b.id)'>删除</button>
                                    </span>
                                </li>
                            </div>
                        </ul>
                    </div>
                </ul>
                
            </div>
        </ul>
    </div>

    <div class='modal fade modal-list-form modal-edit-menu'>
        <div class='modal-dialog'>
            <div class='modal-content' align='center'>
                <div class='modal-header'>
                    菜单编辑    <a class='close' data-dismiss='modal'>&times;</a>
                </div>
                <div class='modal-body'>
                    <table class='table-form'>
                        <tr>
                            <td class='td-label'>标题:</td>
                            <td><input type='text' class='form-control input-sm' ng-model='title'></td>
                        </tr>
                        <tr>
                            <td class='td-label'>排序:</td>
                            <td><input type='number' class='form-control input-sm' ng-model='sort'></td>
                        </tr>
                        <tr>
                            <td class='td-label'>链接:</td>
                            <td><input type='text' class='form-control input-sm' ng-model='url'></td>
                        </tr>
                        <tr>
                            <td class='td-label'>上级:</td>
                            <td>
                                <select class='form-control input-sm' ng-model='pid'>
                                    <option ng-repeat='menu in option_menus' value='{{menu.id}}'>{{menu.title_show}}</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td class='td-label'>分组:</td>
                            <td>
                                <input type='text' class='form-control input-sm' ng-model='group'>
                            </td>
                        </tr>
                        <tr>
                            <td class='td-label'>隐藏:</td>
                            <td>
                                <div class='box-radio'>
                                    <input type='radio' ng-model='hide' class='radio-hide' value='0'>
                                    <label>显示</label>
                                </div>
                                <div class='box-radio'>
                                    <input type='radio' ng-model='hide' class='radio-hide' value='1'>
                                    <label>隐藏</label>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class='td-label'>说明:</td>
                            <td>
                                <input type='text' class='form-control input-sm' ng-model='tip'>
                            </td>
                        </tr>
                    </table>
                </div>
                <div class='modal-footer'>
                    <button class='btn btn-primary btn-sm btn-w-sm' ng-click='save()'>保存</button>
                    <button class='btn btn-default btn-sm btn-w-sm' data-dismiss='modal'>取消</button>
                </div>
            </div>
        </div>
    </div>

    <div class='modal fade modal-list-form modal-add-menu'>
        <div class='modal-dialog'>
            <div class='modal-content' align='center'>
                <div class='modal-header'>
                    菜单添加    <a class='close' data-dismiss='modal'>&times;</a>
                </div>
                <div class='modal-body'>
                    <table class='table-form'>
                        <tr>
                            <td class='td-label'>标题:</td>
                            <td><input type='text' class='form-control input-sm' ng-model='title'></td>
                        </tr>
                        <tr>
                            <td class='td-label'>排序:</td>
                            <td><input type='number' class='form-control input-sm' ng-model='sort'></td>
                        </tr>
                        <tr>
                            <td class='td-label'>链接:</td>
                            <td><input type='text' class='form-control input-sm' ng-model='url'></td>
                        </tr>
                        <tr>
                            <td class='td-label'>上级:</td>
                            <td>
                                <select class='form-control input-sm' ng-model='pid'>
                                    <option ng-repeat='menu in option_menus' value='{{menu.id}}'>{{menu.title_show}}</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td class='td-label'>分组:</td>
                            <td>
                                <input type='text' class='form-control input-sm' ng-model='group'>
                            </td>
                        </tr>
                        <tr>
                            <td class='td-label'>隐藏:</td>
                            <td>
                                <div class='box-radio'>
                                    <input type='radio' ng-model='hide' class='radio-hide' value='0'>
                                    <label>显示</label>
                                </div>
                                <div class='box-radio'>
                                    <input type='radio' ng-model='hide' class='radio-hide' value='1'>
                                    <label>隐藏</label>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class='td-label'>说明:</td>
                            <td>
                                <input type='text' class='form-control input-sm' ng-model='tip'>
                            </td>
                        </tr>

                    </table>
                </div>
                <div class='modal-footer'>
                    <button class='btn btn-primary btn-sm btn-w-sm' ng-click='save("add")'>保存</button>
                    <button class='btn btn-default btn-sm btn-w-sm' data-dismiss='modal'>取消</button>
                </div>
            </div>
        </div>
    </div>
</div>